import { ExpeditionOrderDishManage } from './../../components/expeditionOrderDishManage';
import { Orderitem, Order } from './../../models/order';
import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core';

@Component({
    selector: 'suspended-orderitem',
    styleUrls: ['./index.scss'],
    template: `
        <div class="suspended_orderitem_container" [class.refund]='refund' >
            <div class="item_info"  [class.delete_line]="deleteKitchen">
                <span class="item_num" [class.more_items]="orderItem.qty > 1">{{orderItem.qty}}</span>
                <span class="item_name">{{orderItem.inventoryName}}</span>
                <span [hidden]="!deleteKitchen" class="min_btn cancel_item" (click)="remove(itemm)">退</span>
                <span [hidden]="!hurry" class="min_btn hurry_item" (click)="remove(itemm)">催</span>                
                <i [hidden]="deleteKitchen || !addDeleteBtn" class="material-icons icon" (click)="remove(itemm)">clear</i>             
            </div>
            <div class="modifier"  *ngIf="orderItem.description || (orderItem.modifiers&&orderItem.modifiers&&orderItem.modifiers.length)">
                <span class='description' *ngFor="let option of flatOptions(orderItem.modifiers)" >
                    {{option.name}}
                </span><span class='description' *ngIf="orderItem.description">
                    {{orderItem.description}}
                </span>
            </div>
        </div>
    `
})
export class SuspendedOrderItem implements OnInit {
    @Input() orderItem: Orderitem;
    @Input() order: Order;
    @Input() addDeleteBtn: Boolean;
    
    @Output() removeItem = new EventEmitter<any>();

    get hurry() {
        return !this.deleteKitchen && this.orderItem && (this.orderItem.remindCount > 0);
    }

    get deleteKitchen() {
        return this.orderItem && (this.orderItem.qty == this.orderItem.refundQty);
    }

    constructor() { }

    private trackById(index: number, modifier: any) {
        return modifier.id;
    }

    private flatOptions(modifiers, description) {
        if (modifiers.length == 0) return [];
        return modifiers.map(x => x.options).reduce((x, y) => x.concat(y))
    }

    ngOnInit() {
       
    }

    remove() {
        this.removeItem.emit();
    }

}